<template>
  <div class="lang">

    <!-- <svg-icon icon-class="user" /> -->
    <el-dropdown @command="handleCommand">
      <span class="el-dropdown-link">
        <i class="el-icon-cold-drink" />
      </span>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item command="zh">中文zh</el-dropdown-item>
        <el-dropdown-item command="en">英文en</el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
  </div>
</template>
<script>
export default {
  name: '',
  data() {
    return {}
  },
  methods: {
    handleCommand(lang) {
      this.$i18n.locale = lang
      this.$message('click on item ' + lang)
      console.log(this.$i18n.locale)
    }
  }
}
</script>

  <style lang="scss" scoped>
  .lang {
    display: inline-block;
    font-size: 22px;
    color: #a2ed08;
    margin-right: 15px;
    .el-dropdown {
      color: #a2ed08;
      .el-dropdown-link {
        color: #a2ed08;
      }
    }
  }
  .el-dropdown-link {
      cursor: pointer;
      color: #409EFF;
    }
    .el-icon-arrow-down {
      font-size: 12px;
    }
  </style>

